section {
  margin-top: 5vw;
}
.loading{
  position: fixed;
  background-image: url('../../assets/images/loading_bg.jpg');
  background-size: contain;
  background-position: center top;
}
.banner {
  position: relative;
  .slider {
    max-width: 730px;
    padding: 0 3vw;
    margin-top: -30vw;
    margin-left: auto;
    margin-right: auto;
    font-size: 0;
    border-radius: 4px;
    img {
      border-radius: 4px;
    }
  }
  .bg {
    height: 30vw;
    background-color: $theme;
  }
}

.section-title {
  margin-bottom: 5vw;
  padding-left: 0.5em;
  font-size: 18px;
  border-left: 5px solid $theme;
}

.recommend-list,
.recommend-songs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  min-height: 68vw;
  li {
    position: relative;
    width: 32vw;
    margin-bottom: 2vw;
    font-size: 0;
    img {
      border-radius: 4px;
    }
    &:before {
      content: '';
      position: absolute;
      width: 100%;
      height: 5vw;
      background-image: linear-gradient(180deg, rgba(0, 0, 0, .2), transparent)
    }
    .meta {
      padding: 5px 0;
      p {
        height: 19px;
        font-size: 13px;
        line-height: 19px;
        overflow: hidden;
      }
      .singer{
        color: #666;
      }
    }
  }
}

.recommend-list {
  li {
    .play-count {
      position: absolute;
      z-index: 2;
      right: 2vw;
      top: 2vw;
      font-size: 13px;
      color: #fff;
      text-shadow: 1px 1px 1px rgba(0, 0, 0, .2)
    }
  }
}